<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>话伴网页版-最近联系人</title>
<link href="css/reset.css" type="text/css" rel="stylesheet" />
<link href="css/global.css" type="text/css" rel="stylesheet" />
<link href="css/commom.css" type="text/css" rel="stylesheet" />
<link href="css/recent-layout.css" type="text/css" rel="stylesheet" />
<script src="js/jquery-1.5.2.min.js" type="text/javascript"></script>
<script src="js/popupdiv.js" type="text/javascript"></script>
<script src="js/commom.js" type="text/javascript"></script>
</head>
<body>
<div id="wrap">
  <div id="header"> <span class="h-l"></span><span class="h-l h-r"></span>
    <div class="logo"><a href="http://web.33e9.com" title="返回首页"><img src="images/logo.gif" alt="返回首页"/></a></div>
    <!-- End .logo -->
    <em></em>
    <!-- 打开菜单只需添加“menu-hover”样式如：<dl class="menu menu-hover">  -->
    <dl class="menu">
      <dt class="menu-top"><span class="triangle box_r"></span>我的身份</dt>
      <dd class="menu-bottom">
        <div class="menu-preson"><a href="#">个人</a></div>
        <div class="menu-busine">我加入的组织：</div>
        <ul>
          <li><a href="#">飞告传媒</a></li>
          <li><a href="#">大众通信技术</a></li>
        </ul>
        <!-- End .menu-busine -->
      </dd>
    </dl>
    <!-- End .menu -->
    <!-- 打开菜单只需添加“menu-hover”样式如：<dl class="menu menu-hover menu-msg">  -->
    <dl class="menu menu-msg">
      <dt class="menu-top new-msg">新短信(10)</dt>
      <dd class="menu-bottom">
        <ul>
          <li><a href="#">Classyuan(5)</a></li>
          <li><a href="#">张三(5)</a></li>
        </ul>
        <!-- End .menu-busine -->
      </dd>
    </dl>
    <!-- End .menu -->
    <div class="login-info"> 欢迎您，<a href="#" target="_blank">ClassYuan</a> <a href="#" target="_blank">[退出]</a> <a href="#" target="_blank">我的话伴</a> | <a href="#" target="_blank">我要充值</a> | <a href="#" target="_blank">话伴官网</a> </div>
    <!-- End .login-info -->
  </div>
  <!-- End #header -->
  <div id="container" class="clearfix"> <b class="round r-t"></b> <b class="round r-r"></b>
    <div class="col1 box_l">
      <div class="user clearfix">
        <div class="user-info">
          <!--
                        企业男：b_male_48x48.gif
                        企业女：b_female_48x48.gif
                        个人男：u_male_48x48.gif
                        个人女：u_female_48x48
                        保　密：user48x48.gif
                        -->
          <img src="images/user48x48.gif" alt="ClassYuan" class="box_l"/> <b>当前身份：</b> <span title="三三得玖电子商务三三得玖电子商务">aaaaaaaaaaaaaaaaaaaaaaaaaaa</span> </div>
        <!-- End .user-info -->
        <div class="user-phone"> 
         <!-- 点击返回状态后的效果：
                            <a href="#" class="blue box_r">修改</a>15959451214
                            -->
          <!-- 点击修改状态后的效果（点击任地方恢复之前状态）：-->
          <dl class="droplist">
            	<dt><em class="triangle"></em>0755-26744444</dt>
                <dd class="hide">
                	<a href="javascript:void(0);" value="0755-26744444">0755-26744444</a>
                	<a href="javascript:void(0);" value="15959451214">15959451214</a>
                    <a href="javascript:void(0);" value="buy"><img src="images/add.png" class="box_l"/>添加接听话机</a>
                </dd>
            </dl>
                            
        </div>
        <!-- End .user-phone -->
        <div class="user-phone user-tel clearfix">
          
                            <a href="#" class="blue box_r">修改</a>15959451214
                           
          <!-- 鼠标点击任地方恢复之前状态 
                            	修改接听话机按钮
                           
          <dl class="droplist">
            	<dt><em class="triangle"></em><span></span></dt>
                <dd class="hide">
                	<a href="javascript:void(0);" value="0755-26744444">0755-26744444</a>
                	<a href="javascript:void(0);" value="15959451214">15959451214</a>
                	<a href="javascript:void(0);" value="隐藏号码">隐藏号码</a>
                    <a href="javascript:void(0);" value="购买号码"><img src="images/cart.png" class="box_l"/>购买号码</a>
                </dd>
            </dl>
           -->
        </div>
        <!-- End .user-phone -->
        <!-- 切换接听话机效果
                        <div class="user-loading text-center">
                            <img src="images/loading.gif" alt=""/>
                        </div>
                        -->
      </div>
      <!-- End .user -->
      <dl class="nav">
        <dt class="open"><a href="javascript:void(0);">个人通讯录</a></dt>
        <dd>
          <ul class="personal-list">
            <!-- 当前状态：增加“current”样式 例如： <li class="current"> -->
            <li class="current"><a href="personal.html">全部(118)</a></li>
            <li><a href="personal.html">我的好友(60)</a></li>                             
            <li> <a href="personal.html">公司同事(50)</a>
            <span class="personal-tool hide"><a href="javascript:void(0);" class="tool-edit" title="编辑分组"></a><a href="javascript:void(0);" class="tool-del" title="删除分组"></a></span>
            </li>
            <li><a href="personal.html">陌生人(8)</a></li>
            
            <!--
            	点击新建分组显示下面的html，删除hide样式即可
               新建分组：
           -->
            <li class="hide"><input value="" maxlength="30" class="tool-txt"/><span class="personal-tool"><a href="javascript:void(0);" class="tool-add" title="新建分组"></a><a href="javascript:void(0);" class="tool-hide" title="取消编辑"></a></span></li>          
            <li class="last tool-addbtn"><a href="javascript:void(0);">新建分组</a></li>
          </ul>
          <!-- End .a -->
        </dd>
        <!-- 当前状态：增加“current”样式 例如： <dt class="current"> -->
        <dt class="close"><a href="javascript:void(0);">组织通讯录</a></dt>
        <dd class="hide">
          <ul>
            <!-- 当前状态：增加“current”样式 例如： <li class="current"> -->
            <li class="current"><a href="business.html">飞告传媒</a></li>
            <li><a href="business.html">大众通信技术</a></li>
            <li><a href="business.html">三三得玖电子商务</a></li>
            <li><a href="business.html">三三得玖通信技术</a></li>
          </ul>
          <!-- End .a -->
        </dd>
        <dt><a href="recentcontacts.html">最近联系人</a></dt>
        <dt><a href="call.html">拨打电话</a></dt>
        <dt><a href="sendmsg.html">发送短信</a></dt>
      </dl>
      <!-- End .nav -->
    </div>
    <!-- End .col1 -->
    <div class="col2 box_r">
      <div class="top">
        <div class="top-title">
          <h1 class="box_l">最近联系人</h1>
        </div>
        <!-- End .search -->
      </div>
      <!-- End .top -->
      <table class="grid linkman">
        <thead>
          <tr>
            <th width="0" class="noboder"></th>
            <th width="20%" class="title-name">姓　名</th>
            <th width="40%" class="text-left">号　码</th>
            <th width="25%" class="text-left">时　间</th>
            <th width="15%" class="text-left"></th>
            <th width="0" class="noboder"></th>
          </tr>
        </thead>
        <tfoot>
          <tr>
            <td colspan="6" class="page"><span class="page-total box_l text-left">共计：160条记录</span>
              <div class="page-list box_r text-right"> <a href="javascript:void(0);" title="首页">&lt;&lt;</a> <a href="javascript:void(0);" title="上一页">&lt;</a> <span class="current">1</span> <a href="javascript:void(0);">2</a> <a href="javascript:void(0);">3</a><span class="diabled">...</span><a href="#" title="下一页">&gt;</a> <a href="javascript:void(0);" title="尾页">&gt;&gt;</a> 共 20 页  跳转至
                <select>
                  <option>1</option>
                  <option>2</option>
                  <option>3</option>
                  <option>4</option>
                  <option>5</option>
                </select>
                页 </div>
              <!-- End .page-list --></td>
          </tr>
        </tfoot>
        <tbody>
          <tr>
            <td class="noboder"></td>
            <!--
                                样式：
                                男：grid-male
                                女：grid-female
                                保密：grid-user
                                -->
            <td><a href="owner.html" target="_blank"  class="gicon grid-male">ClassYuan</a></td>
            <td>15984848484</td>
            <td>2011-3-25 14:26:32</td>
            <td><a href="javascript:void(0);" class="gicon grid-msg" title="发短信">&nbsp;</a><a href="javascript:void(0);" class="gicon grid-tel" title="打电话">&nbsp;</a></td>
            <td class="noboder"></td>
          </tr>
          <tr class="even">
            <td class="noboder"></td>
            <td><a href="owner.html" target="_blank"  class="gicon grid-female">ClassYuan</a></td>
            <td>0755-25412145</td>
            <td>2011-3-25 14:26:32</td>
            <td><a href="javascript:void(0);" class="gicon grid-nmsg" title="固话不能发短信">&nbsp;</a><a href="javascript:void(0);" class="gicon grid-tel" title="打电话">&nbsp;</a></td>
            <td class="noboder"></td>
          </tr>
          <tr>
            <td class="noboder"></td>
            <td><a href="owner.html" target="_blank"  class="gicon grid-user">--</a></td>
            <td>15984848484 <a href="javascript:void(0);" onclick="openAddBookSel();" class="gicon grid-addbook">添加到个人通讯录</a></td>
            <td>2011-3-25 14:26:32</td>
            <td><a href="javascript:void(0);" class="gicon grid-msg" title="发短信">&nbsp;</a><a href="javascript:void(0);" class="gicon grid-tel" title="打电话">&nbsp;</a></td>
            <td class="noboder"></td>
          </tr>
          <tr class="even">
            <td class="noboder"></td>
            <td><a href="owner.html" target="_blank"  class="gicon grid-female">ClassYuan</a></td>
            <td>15984848484</td>
            <td>2011-3-25 14:26:32</td>
            <td><a href="javascript:void(0);" class="gicon grid-nmsg" title="固话不能发短信">&nbsp;</a><a href="javascript:void(0);" class="gicon grid-tel" title="打电话">&nbsp;</a></td>
            <td class="noboder"></td>
          </tr>
          <!--没有数据状态：
                            <tr>
                                <td colspan="4" valign="center" class="grid-empty text-center"> <img src="images/loading.gif" alt=""/><br/>数据加载中</td>
                            </tr>
                            -->
        </tbody>
      </table>
    </div>
    <!-- End .col2 -->
    <div class="clear col-bottom"> <b class="round r-l"></b> <b class="round r-b"></b> </div>
    <!-- End .col-bottom -->
  </div>
  <!-- End #container -->
  <div id="footer" class="text-center"> &copy; 2011 深圳市三三得玖电子商务有限公司　　 客服热线： <span onclick="openCallKeFuMsg()" title="点击拨打客服电话">4007168339</span> </div>
  <!-- End #footer -->
</div>
<!-- End #wrap -->
<div class="hide" poptitle="打电话给TA" id="callmsg">
  <div class="pop-callmsg text-center">
    <p class="bold blue1"><span class="succ">&nbsp;</span>呼叫请求成功！</p>
    <p>请注意，接听您的接听话机</p>
    <p>13632620138</p>
  </div>
  <!-- End .pop-box -->
  <!-- 加载状态
                <div class="pop-callmsg text-center">
                    <p class="font14 blue1 bold">正在呼叫...</p>
                    <p class="font14 blue1 bold">0755-26743485</p>
                    <p><img src="images/loading.gif" alt=""/></p>
                </div>-->
  <!-- End .pop-box -->
  <div class="pop-bottom">
    <input type="submit" value="关闭" class="pop-closebtn box_r" onclick="closePanel('#callmsg');"/>
  </div>
</div>
<!-- End #pop-call -->
<div class="hide" poptitle="选择联系人" id="searchbook">
  <div class="clearfix pop-searchbook">
    <div class="pop-search">
      <input type="text" value="输入姓名、电话号码" class="search-text"/>
      <input type="submit" class="search-btn1" value="搜索"/>
    </div>
    <div class="searchbook-left">
      <h3>个人通讯录</h3>
      <ul>
        <li><a href="javascript:void(0);">全部(101)</a></li>
        <li><a href="javascript:void(0);">我的好友(50)</a></li>
        <li><a href="javascript:void(0);">大学同学(30)</a></li>
        <li><a href="javascript:void(0);">高中同学(20)</a></li>
        <li><a href="javascript:void(0);">家人(1)</a></li>
        <li><a href="javascript:void(0);">陌生人(0)</a></li>
      </ul>
    </div>
    <div class="searchbook-right">
      <table class="grid linkman">
        <thead>
          <tr>
            <th width="0" class="noboder"></th>
            <th width="100%" class="title-name">姓　名</th>
            <th width="0" class="noboder"></th>
          </tr>
        </thead>
        <tfoot>
          <tr>
            <td class="page" colspan="3"><span class="page-total box_l text-left">共计：160条记录</span>
              <div class="page-list box_r text-right"> <a href="javascript:void(0);" title="上一页">上一页</a> <a href="#" title="下一页">下一页</a> </div>
              <!-- End .page-list --></td>
          </tr>
        </tfoot>
        <tbody>
          <tr onclick="closePanel('#searchbook');openUpdateBook();">
            <td class="noboder"></td>
            <!--
                                样式：
                                男：grid-male
                                女：grid-female
                                保密：grid-user
                                -->
            <td><a class="gicon grid-male" target="_blank" href="javascript:void(0);">ClassYuan</a></td>
            <td class="noboder"></td>
          </tr>
          <tr onclick="closePanel('#searchbook');openUpdateBook();" class="even">
            <td class="noboder"></td>
            <td><a class="gicon grid-female" href="javascript:void(0);">ClassYuan</a></td>
            <td class="noboder"></td>
          </tr>
          <tr onclick="closePanel('#searchbook');openUpdateBook();" class="even">
            <td class="noboder"></td>
            <td><a class="gicon grid-female" href="javascript:void(0);">ClassYuan</a></td>
            <td class="noboder"></td>
          </tr>
          <tr onclick="closePanel('#searchbook');openUpdateBook();" class="even">
            <td class="noboder"></td>
            <td><a class="gicon grid-female" href="javascript:void(0);">ClassYuan</a></td>
            <td class="noboder"></td>
          </tr>
          <tr onclick="closePanel('#searchbook');openUpdateBook();" class="even">
            <td class="noboder"></td>
            <td><a class="gicon grid-female" href="javascript:void(0);">ClassYuan</a></td>
            <td class="noboder"></td>
          </tr>
          <tr onclick="closePanel('#searchbook');openUpdateBook();" class="even">
            <td class="noboder"></td>
            <td><a class="gicon grid-female" href="javascript:void(0);">ClassYuan</a></td>
            <td class="noboder"></td>
          </tr>
          <tr onclick="closePanel('#searchbook');openUpdateBook();" class="even">
            <td class="noboder"></td>
            <td><a class="gicon grid-female" href="javascript:void(0);">ClassYuan</a></td>
            <td class="noboder"></td>
          </tr>
          <tr onclick="closePanel('#searchbook');openUpdateBook();" class="even">
            <td class="noboder"></td>
            <td><a class="gicon grid-female" href="javascript:void(0);">ClassYuan</a></td>
            <td class="noboder"></td>
          </tr>
          <tr onclick="closePanel('#searchbook');openUpdateBook();" class="even">
            <td class="noboder"></td>
            <td><a class="gicon grid-female" href="javascript:void(0);">ClassYuan</a></td>
            <td class="noboder"></td>
          </tr>
          <tr onclick="closePanel('#searchbook');openUpdateBook();" class="even">
            <td class="noboder"></td>
            <td><a class="gicon grid-female" href="javascript:void(0);">ClassYuan</a></td>
            <td class="noboder"></td>
          </tr>
          <!--数据加载状态：
           <tr>
             <td colspan="3" valign="center" class="grid-empty text-center"> <img src="images/loading.gif" alt=""/><br/>数据加载中</td>
           </tr>
           
          -->
        </tbody>
      </table>
    </div>
  </div>
</div>
<!-- End .pop-searchbook -->
<div class="hide" id="addbooksel" poptitle="操作选项">
  <div class="pop-addbooksel">
    <p onclick="openAddBook();closePanel('#addbooksel');">
      <a href="javascript:void(0);" class="blue1">新增联系人</a>
    </p>
    <p onclick="openSearchBook();closePanel('#addbooksel');">
      <a href="javascript:void(0);" class="blue1">修改联系人</a>
    </p>
  </div>
</div>
<div class="hide" id="addbook" poptitle="新增联系人">
  <div class="addbook">
    <div class=" clearfix"> <img class="box_l portrait" alt="ClassYuan" src="images/user64x64.gif">
      <div class="pop-info">
        <p>姓名：
          <input type="text" />
        </p>
        <p>性别：
          <input type="radio" id="male" checked="checked" name="sex" />
          <label for="male">男</label>
          <input type="radio" id="female" name="sex" />
          <label for="female">女</label>
          <input type="radio" id="privary" name="sex" />
          <label for="privary">保密</label>
        </p>
        <p>分组：
          <select>
            <option>我的好友</option>
            <option>亲人</option>
            <option>陌生人</option>
          </select>
        </p>
      </div>
    </div>
    <div class="pop-items">
      <div class="pop-items-title">联系方式</div>
      <p>
        <select>
          <option>手机号码</option>
          <option>办公电话</option>
          <option>家庭电话</option>
          <option>其他电话</option>
        </select>
        <input type="text" class="input-text"//>
        <span class="pop-items-del">&times;</span> </p>
      <p class="pop-items-des"><a href="#" class="blue">+添加新号码</a></p>
      <p>
        <select>
          <option>常用邮箱</option>
          <option>其他邮箱</option>
          <option>QQ</option>
          <option>MSN</option>
          <option>Skype</option>
          <option>Fetion</option>
        </select>
        <input type="text" class="input-text"//>
        <span class="pop-items-del" title="关闭">&times;</span> </p>
      <p class="pop-items-des"><a href="#" class="blue">+添加新信息</a></p>
    </div>
    <div class="pop-items">
      <div class="pop-items-title">更多详情</div>
      <p>
        <!-- 选择生日需要用时间戳控件 -->
        <select>
          <option value="生日">生日</option>
          <option value="公司名称">公司名称</option>
          <option value="所在部门">所在部门</option>
          <option value="职务名称">职务名称</option>
          <option value="公司地址">公司地址</option>
          <option value="家庭地址" selected="">家庭地址</option>
          <option value="公司邮编">公司邮编</option>
          <option value="家庭邮编">家庭邮编</option>
          <option value="备注">备注</option>
        </select>
        <input type="text" class="input-text"/>
        <span class="pop-items-del" title="删除">&times;</span> </p>
      <p class="pop-items-des"><a href="#" class="blue">+添加新信息</a></p>
      <p class="pop-error"> 姓名不能为空 </p>
    </div>
  </div>
  <!-- End .pop-box -->
  <div class="pop-bottom text-center">
    <input type="submit" value="保存" class="pop-okbtn"/>
  </div>
  <!-- End .pop-bottom -->
</div>












<div class="hide" id="upadtebook" poptitle="修改联系人">
  <div class="addbook">
    <div class=" clearfix"> <img class="box_l portrait" alt="ClassYuan" src="images/user64x64.gif">
      <div class="pop-info">
        <p>姓名：
          <input type="text" value="欧阳小雪" />
        </p>
        <p>性别：
          <input type="radio" id="male" checked="checked" name="sex" />
          <label for="male">男</label>
          <input type="radio" id="female" name="sex" />
          <label for="female">女</label>
          <input type="radio" id="privary" name="sex" />
          <label for="privary">保密</label>
        </p>
        <p>分组：
          <select>
            <option>我的好友</option>
            <option>亲人</option>
            <option>陌生人</option>
          </select>
        </p>
      </div>
    </div>
    <div class="pop-items">
      <div class="pop-items-title">联系方式</div>
      <p>
        <select>
          <option>手机号码</option>
          <option>办公电话</option>
          <option>家庭电话</option>
          <option>其他电话</option>
        </select>
        <input type="text" value="15989497779" class="input-text"//>
        <span class="pop-items-del" title="删除">&times;</span> </p>
      <p>
        <select>
          <option>手机号码</option>
          <option selected="selected">办公电话</option>
          <option>家庭电话</option>
          <option>其他电话</option>
        </select>
        <input type="text" value="075583136601" class="input-text"//>
        <span class="pop-items-del" title="删除">&times;</span> </p>
      <p class="pop-items-des"><a href="#" class="blue">+添加新号码</a></p>
      <p>
        <select>
          <option>常用邮箱</option>
          <option>其他邮箱</option>
          <option>QQ</option>
          <option>MSN</option>
          <option>Skype</option>
          <option>Fetion</option>
        </select>
        <input type="text" class="input-text"//>
        <span class="pop-items-del" title="删除">&times;</span> </p>
      <p class="pop-items-des"><a href="#" class="blue">+添加新信息</a></p>
    </div>
    <div class="pop-items">
      <div class="pop-items-title">更多详情</div>
      <p>
        <!-- 选择生日需要用时间戳控件 -->
        <select>
          <option value="生日">生日</option>
          <option value="公司名称">公司名称</option>
          <option value="所在部门">所在部门</option>
          <option value="职务名称">职务名称</option>
          <option value="公司地址">公司地址</option>
          <option value="家庭地址" selected="">家庭地址</option>
          <option value="公司邮编">公司邮编</option>
          <option value="家庭邮编">家庭邮编</option>
          <option value="备注">备注</option>
        </select>
        <input type="text" class="input-text"//>
        <span class="pop-items-del" title="删除">&times;</span> </p>
      <p class="pop-items-des"><a href="#" class="blue">+添加新信息</a></p>
      <p class="pop-error"> 姓名不能为空 </p>
    </div>
  </div>
  <!-- End .pop-box -->
  <div class="pop-bottom text-center">
    <input type="submit" value="保存" class="pop-okbtn"/>
  </div>
  <!-- End .pop-bottom -->
</div>


<div class="hide" poptitle="拨打客服电话" id="callkefumsg">
    <div class="pop-callkefumsg text-center">
      <p class="bold blue1 font14">拨打客服电话</p>
      <p class="bold blue1 font14">4007168339</p>
    </div>
    <!-- End .pop-box -->
    <!-- 加载状态
                <div class="pop-callmsg text-center">
                    <p class="font14 blue1 bold">正在呼叫...</p>
                    <p class="font14 blue1 bold">0755-26743485</p>
                    <p><img src="images/loading.gif" alt=""/></p>
                </div>-->
    <!-- End .pop-box -->
    <div class="pop-bottom">
      <input type="submit" value="取消" class="pop-closebtn box_r" onclick="closePanel('#callkefumsg');"/><input type="submit" value="确定" class="pop-closebtn box_r"/>
    </div>
</div>
<!-- End #callmsg -->
</body>
</html>
